<template>
	<view>
		<u--form labelPosition="left" :model="model1" :rules="rules" ref="uForm" labelWidth="100"
			:labelStyle="{color: '#fff' }">
			<view class="plr15 bg-default1">

				<u-form-item class="u-form-item" :label="$t('text.yanyuan1')" prop="videoInfo.uname" borderBottom ref="item1">
					<u--input v-model="model1.videoInfo.uname" border="none" color="rgba(255, 255, 255, 0.9)"
						placeholderStyle="rgba(255, 255, 255, 0.4)" :placeholder="$t('text.placeholders')"></u--input>
				</u-form-item>
	
			</view>
			<view class="plr15 bg-default1 mt10">
				<u-form-item class="u-form-item" labelPosition="top" :label="$t('text.yanyuan2')" prop="videoInfo.image" ref="item1">
					<u-upload class="mt10" :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1"
						multiple :maxCount="1"></u-upload>
				</u-form-item>
			</view>
			<view class="plr15 bg-default1 mt10">
				<u-form-item class="u-form-item" :label="$t('text.yanyuan3')"  prop="videoInfo.type" @click="showPrivate = true;"
					ref="item1">
					<u--input v-model="model1.videoInfo.types" border="none" color="rgba(255, 255, 255, 0.9)"
						placeholderStyle="rgba(255, 255, 255, 0.4)" :placeholder="$t('text.psd14')"></u--input>
					<u-icon slot="right" name="arrow-right"></u-icon>
				</u-form-item>
			</view>
			<!-- <view class="plr15 bg-default1 mt10">
				<view v-for="(item,index) in jishuList" :key="index">
					<u-form-item class="u-form-item" label="影视集数" prop="videoInfo.star" ref="item1">
						<u--input v-model="jishu[index].num" border="none" color="rgba(255, 255, 255, 0.9)"
							placeholderStyle="rgba(255, 255, 255, 0.4)" placeholder="请输入" type="number"></u--input>
						<u-icon slot="right" name="close-circle" color="#fff" @click="closeJishu(index)"></u-icon>
					</u-form-item>
					<u-upload :fileList="jishu[index].file" @afterRead="afterRead" @delete="deletePic" name="2" multiple
						:maxCount="1" accept="video"></u-upload>
				</view>
			</view> -->
		</u--form>
		
		<u-action-sheet :actions="privateList" :closeOnClickOverlay="true" :title="privateTitle"
			:closeOnClickAction="true" :show="showPrivate" :cancelText="$t('text.cancel')" @select="privateSelectClick"
			@close="close"></u-action-sheet>
		
		<view style="height: 150rpx;"></view>
		<view class="release flex alcenter space">
	
			<view class="btn" @click="$u.throttle(submit, 1000)">{{$t('text.qd')}}</view>
		</view>
	</view>

</template>

<script>
	import configs from "@/common/config.js"
	export default {
		data() {
			return {
				title: this.$t('text.yanyuan4'),
				showCharge: false,

				privateTitle: this.$t('text.type'),
				privateList: [{
						name: this.$t("text.yanyuan"),
						value: 0
					},
					{
						name: this.$t('text.yanyuan5'),
						value: 1
					}
				],
				showPrivate: false,

				showType: false,
		
				model1: {
					videoInfo: {
						// isCharge: '',
						id: 0,
						uname: '',
						image: '',
						types: '', //是否私密
						 //是否私密
					},
				},
				type: '',
				rules: {
				
					'videoInfo.uname': {
						type: 'string',
						required: true,
						message: this.$t('text.yanyuan6'),
						trigger: ['blur', 'change']
					},
					'videoInfo.types': {
						type: 'string',
						required: true,
						message: this.$t('text.yanyuan7'),
						trigger: ['blur', 'change']
					},

				},
				radio: '',
				switchVal: false,

				fileList1: [],

				jishuList: [],
				jishu: [],
				urls: configs.webUrl,

				id: 0, //视频id

			}
		},
		onLoad(e) {
			//console.log(111)
			if (e.id > 0) {
				this.id = e.id
				this.getinfo()
			}

		},

		methods: {
			
			//是否私密
			privateSelectClick(e) {
				this.type = e.value
				this.model1.videoInfo.types = e.name
				this.close()
			},
			close() {
				this.showCharge = false
				this.showPrivate = false
			},
	

			// 删除图片
			deletePic(event) {
				this[`fileList${event.name}`].splice(event.index, 1);
			},
			// 新增图片
			async afterRead(event) {
				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
				let lists = [].concat(event.file);
				let fileListLen = this[`fileList${event.name}`].length;
				lists.map((item) => {
					this[`fileList${event.name}`].push({
						...item,
						status: "uploading",
						message: "上传中",
					});
				});
				for (let i = 0; i < lists.length; i++) {
					const result = await this.uploadFilePromise(lists[i].url);
					let item = this[`fileList${event.name}`][fileListLen];
					this[`fileList${event.name}`].splice(
						fileListLen,
						1,
						Object.assign(item, {
							status: "success",
							message: "",
							url: result,
						})
					);
					fileListLen++;
				}
			},

			uploadFilePromise(url) {
				return new Promise((resolve, reject) => {
					let a = uni.uploadFile({
						url: this.configs.webUrl + '/api/Common/upload?token=' + uni.getStorageSync(
							"userinfo").token, // 仅为示例，非真实的接口地址
						filePath: url,
						name: "file",
						formData: {
							'token': uni.getStorageSync("userinfo").token,
						},
						success: (res) => {
							var dataarr = JSON.parse(res.data);
							if (dataarr.code == 1) {
								console.log(dataarr.data.url)
								this.model1.videoInfo.image = dataarr.data.url
								resolve(this.configs.imgUrl + dataarr.data.url)

							} else {
								uni.showToast({
									title: dataarr.msg
								})
							}
							
							 console.log(this[`fileList1`])
							// setTimeout(() => {
							// 	resolve(res.data.data);
							// }, 1000);
						},
					});
				});
			},
			
			//提交表单
			submit() {
				this.$refs.uForm.validate().then(async ress => {
					console.log(this.model1.videoInfo)
					// uni.$u.toast('校验通过')
					let params = this.model1.videoInfo
					params['type'] = this.type
					let res = await this.$httpas.post('/api/creator/juse_add', params, {
						token: true
					});
					if (res[1].data.code == 1) {
						this.$u.toast(res[1].data.msg)
						setTimeout(() => {
							uni.navigateBack()
						}, 1000)
					}
				})

			},

			//获取视频详情
			getinfo() {
				this.$httpas.post2({
					data: {
						do: 'creator',
						op: 'juese_info',
						id: this.id
					},
					success: res => {
						this.model1.videoInfo.id = res.id
						this.model1.videoInfo.uname = res.uname
						this.model1.videoInfo.image  = res.image
				
						this.fileList1.push({
							name:res.image,
							url:res.image,
							thumb:res.image,
						});
						this.model1.videoInfo.types = this.privateList[res.type].name
						this.type = res.type
						

					}
				})

			},
			

		},
		onReady() {
			//如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
			this.$refs.uForm.setRules(this.rules)
		},
	}
</script>

<style scoped lang="scss">
	.release {
		position: fixed;
		bottom: 0;
		right: 0;
		left: 0;
		background: #000;
		padding: 30rpx;

		.btn {
			background: rgba(11, 144, 249, 1);
			text-align: center;
			border-radius: 50rpx;
			padding: 20rpx 0;
			color: #fff;
			width: 100%;
		}
	}

	.add {
		width: 100%;
		padding: 30rpx;

		.btn {
			border: 1px solid #C3C4C4;
			text-align: center;
			border-radius: 50rpx;
			padding: 16rpx 0;
			color: #fff;
		}
	}

	.u-form-item {
		::v-deep.u-form-item__body {
			padding: 30rpx 0;
		}
	}

	.u--input {
		color: #fff;
	}

	.ft10 {
		font-size: 20rpx;
	}

	.flex-c-c {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.checkBox {
		width: 21.5%;
		border-radius: 50rpx;
		text-align: center;
		border: 1px solid #ffffff;
		padding: 10rpx 0;
	}

	.selected {
		background: rgba(26, 140, 239, 0.15);
		color: rgba(11, 144, 249, 1);
		border: 1px solid rgba(26, 140, 239, 0.15);
	}

	.checkBoxbtn {
		position: fixed;
		bottom: 50rpx;
		right: 30rpx;
		left: 30rpx;

		view {
			background: rgba(11, 144, 249, 1);
			text-align: center;
			border-radius: 50rpx;
			padding: 20rpx 0;
			color: #fff;
		}
	}
</style>